<template>
  <div class="check-button" @click="checkBtn">
      <img src="~assets/img/cart/tick.svg" alt="" class="img" :class="{red:checked}">
  </div>
</template>

<script>
export default {
  name: 'checkButton',
  props:{
    checked:{
      type:Boolean,
      default(){
        return false
      }
    }
  },
  data(){
    return{

    }
  },
  methods:{
    checkBtn(){
      this.changeCheck = !this.changeCheck;
      this.$emit("checkBtn");
      console.log('checkBtn')
    }
  }
}
</script>

<style scoped>
  .check-button{
    height: 130px;
    line-height: 130px;
  }
    .img{
      border: solid 1px rgb(136, 136, 136);
      border-radius: 50%;
    }
    .red{
      background-color: rgb(252, 2, 2);
    }
</style>